<template>
	<view class="recycle_order_list-container">
		<!-- Tabs -->
		<view class="tabs-container">
			<u-tabs :list="tabs" :is-scroll="false" :current="tabCurrentIndex" font-size="28" active-color="#333333"
				bar-width="80" :bar-style="{'background-color': '#24A3FF'}" @change="changeTab" />
		</view>

		<!-- Content -->
		<view class="recycle_order_list-content">
			<!-- 全部 -->
			<view>
				<block v-for="item in allOrderList" :key="item.id">
					<view class="recycle_order-list-item">
						<recycle-order-list-panel :data="item" @on-self="goDetails" />
					</view>
				</block>
				<loading-footer :status="allStatus.status" />
			</view>
		</view>
	</view>
</template>


<script>
	import {
		getOrderList
	} from '@/api/recycle';
	import {
		loadingType
	} from '@/utils/type';
	import {
		loadingFun
	} from "@/utils/tools";
	// Tabs列表 -1全部,0待估价1待接受2待寄出3待验收4完成5拒收6关闭交易
	const tabsList = [{
		id: -1,
		name: '全部'
	}, {
		id: 1,
		name: '待接受'
	}, {
		id: 2,
		name: '待寄出'
	}, {
		id: 4,
		name: '已完成',
	}];
	export default {
		data() {
			return {
				tabs: tabsList,
				tabCurrentIndex: 0, // 当前Tab索引  [0-所有订单; 1-进行中订单; 2-已完成订单;]
				tabCurrent: tabsList[0], // 当前Tab索引  [0-所有订单; 1-进行中订单; 2-已完成订单;]
				allOrderList: [], // 所有订单列表
				// 全部列表状态
				allStatus: {
					page: 1,
					status: loadingType.LOADING,
				},
			}
		},
		methods: {
			// 切换Tabs
			changeTab(index) {
				this.tabCurrent = this.tabs[index];
				this.tabCurrentIndex = index;
				this.resetData()
				this.reqAllOrderList()
			},

			// 全部列表数据请求
			reqAllOrderList() {
				loadingFun(
					getOrderList,
					this.allStatus.page,
					this.allOrderList,
					this.allStatus.status, {
						type: this.tabCurrent.id
					}
				).then(res => {
					if (!res) return;
					this.allStatus.page = res.page
					this.allOrderList = res.dataList
					this.allStatus.status = res.status
				});
			},

			// 状态初始化 
			resetData() {
				this.allOrderList.length = 0; // 所有订单列表
				// 全部列表状态
				this.allStatus = {
					page: 1,
					status: loadingType.LOADING,
				}
			},

			// 跳转详情
			goDetails(data) {
				switch (data.status) {
					case 0:
					case 1:
						uni.navigateTo({
							url: '/bundle/pages/recycle_price/recycle_price' +
								'?orderid=' + data.id
						})
						break;
					case 2:
						uni.navigateTo({
							url: '/bundle/pages/recycle_order/recycle_order?id=' + data.id
						})
						break;
					default:
						uni.navigateTo({
							url: '/bundle/pages/recycle_order_detail/recycle_order_detail' +
								'?id=' + data.id
						})
						break;
				}

			}

		},

		onShow() {
			// 初始化请求状态
			this.resetData();
			// 各列表数据请求
			this.reqAllOrderList();
		},

		// 下拉加载更多
		onReachBottom() {
			this.reqAllOrderList();
		},
	}
</script>


<style scoped>
	.recycle_order_list-container {
		padding-top: 88rpx;
	}

	.tabs-container {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
	}

	.recycle_order_list-content {
		padding: 20rpx;
	}

	.recycle_order-list-item:nth-child(n + 2) {
		margin-top: 20rpx;
	}
</style>